<!----><template>
	<view class="my-config">


		<view class="my">
			<view class="my-header">
				<!--<image class="image-bg" src="../../static/背景6.jpg" mode=""></image><!--背景图-->
				<view class="header-main">

					<!--昵称-->

					<view class="header-logo">

						<!-- <image class="logo-img" @click="uploadAvatar" src="loginStatus ? userInfo.imgurl:'../../static/my photo .png'" mode=""></image>-->
						<image class="logo-img" @click="uploadAvatar" :src="getImage(this.user.avatar)" mode="">
						</image> <!--头像-->
				<!-- 		<view class="logo-name" @click="uploadAvatar">点击设置头像</view> -->
						<!--{{  loginStatus ? userInfo.nickName:"用户昵称"}}--><!--如果是登录状态了就显示用户昵称-->
					</view>
					<!--昵称-->

				</view>
			</view>
		</view>

		<view class="config-item" @click="goto1()">
			<view class="text"> 用户昵称：</view>
			<input v-model="this.user.name" placeholder="待渲染"></input>
			<view class="show-pwd"> ></view>
			<view class="config-mark"></view>
		</view>

		<view class="config-item" @click="goto('/pages/introduction/introduction')">
			<view class="text"> 个人介绍：</view>
			<input v-model="this.user.introduce" placeholder="待填写"></input>
			<view class="show-pwd"> ></view>
			<view class="config-mark"></view>
		</view>
		<view class="config-item" @click="goto('/pages/email/email')">
			<view class="text">&nbsp&nbsp&nbsp&nbsp&nbsp邮&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp箱：</view>
			<input v-model="this.user.email" placeholder="待填写"></input>
			<view class="show-pwd"> ></view>
			<view class="config-mark"></view>
		</view>
		<view class="config-item" @click="goto('/pages/birth/birth')">
			<view class="text"> &nbsp&nbsp&nbsp&nbsp生&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp日：</view>
			<input v-model="this.user.birth" placeholder="待填写"></input>
			<view class="show-pwd"> ></view>
			<view class="config-mark"></view>
		</view>

		<view class="config-item" @click="goto('/pages/sex/sex')">
			<view class="text"> 选择性别：</view>
			<text v-if="this.user.sex==false">女</text>
			<text v-if="this.user.sex==true">男</text>
			<input> </input>
			<view class="show-pwd"> ></view>
			<view class="config-mark"></view>
		</view>

		<view class="config-item" @tap='goPathList'>
			<view class="text">地址管理</view>
			<view class="show-pwd1">>>></view>
			<view class="config-mark"></view>
		</view>
		<view class="onbut">
			<button class="btn1" @click="onbut()">提交</button>
		</view>

		<!--<view class="my-exit" @tap='outLogin'>退出登录</view>-->

	</view>
</template>

<script>
	import {
		mapMutations
	} from 'vuex';
	import OrderApi from '@/common/FindingService/OrderApi.js';
	export default {
		props: {
			customer: Object
		},
		data() {
			return {
				nickName: '',
				showFavorites: false,
				showUpdates: false,
				receiveNotifications: false,
				token: '',
				sex: '',
				introduction: '',
				user: [],
				userId: '',
				filepath: [],
				imgsrc: '',
			}
		},
		mounted() {
			
			this.userId = uni.getStorageSync('userId');
			OrderApi.queryUser(this.userId).then(res => {
				this.user = res.data.data
				console.log('用户信息', this.user)
				this.integral = this.user.integral + ' 积分'

			})
			//全局变量用户ID
			// this.user = uni.getStorageSync('user');
			this.token = uni.getStorageSync('token');
			//this.userName = uni.getStorageSync('user.name');
			console.log('555', this.user)
			console.log('77token', this.token)
			//this.address();
			
		},

		methods: {
			...mapMutations(['loginOut']),

			goPathList() {
				uni.navigateTo({
					url: '../my-path-list/my-path-list'
				})
			},
			goToBack() {
				uni.redirectTo({
					url: '/pages/my/my'
				})
			},
			// 从对象存储中获取图片
			getImage(image) {
				return `http://43.136.172.73/api/v1/file/download?fileName=${image}`
			},
			goto(url) {
				uni.navigateTo({
					url: url
				})
			},
			goto1(url) {
				uni.redirectTo({
				  url: '/pages/nickName/nickName?data=' + JSON.stringify(this.user)
				})
			},
			uploadAvatar() {
				var _this = this;



				uni.chooseImage({
					count: 1, //上传图片的数量，默认是9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: function(res) {
						console.log(JSON.stringify(res.tempFilePaths)); //拿到选择的图片，是一个数组
						_this.imgsrc = res.tempFilePaths[0];


						//	uni.uploadFile
						uni.uploadFile({
							url: 'http://43.136.172.73/api/v1/account/upload/files',
							method: 'post',

							header: {
								'Authorization': 'sfsdf',
								// 'Content-Type': 'application/json',
								// "Content-Type": "application/x-www-form-urlencoded",
							},
							filePath: res.tempFilePaths[0], // 将 filePath 设置为要上传的文件路径
							// name: 'file', formData// 后端接口中指定的字段名
							formData: {
								// avatar:_this.user.id+'.'+kzm,
								// userId:_this.user.id
							},

							success: (res) => {
								// 请求成功的回调函数
								console.log('123');
								// console.log('223',_this.user.id);
								//   console.log('222',res);

								//const data = JSON.parse(res.data);
								uni.showToast({
										title: '上传成功',
										icon: 'none',
									}) /
									console.log('文件上传成功:', res);
								//this.avatarUrl = res.fileUrl; // 将服务器返回的文件路径保存到 avatarUrl 变量中
							},
							fail: (err) => {
								// 请求失败的回调函数
								console.log('文件上传失败:', err);
							}
						});
					}
				});

			},
			// uploadAvatar() {
			// 	      // 头像上传逻辑
			// 		   uni.chooseImage({
			// 		        count: 1, // 最多选择一张图片
			// 		        success: (res) => {
			// 		          const tempFilePaths = res.tempFilePaths
			// 		          this.uploadImage(JSON.parse(tempFilePaths[0]))
			// 		        }
			// 		      })

			//     // 头像上传逻辑
			//   // uni.chooseImage({
			//   //      count: 1, // 最多选择一张图片
			//   //      success: (res) => {
			//   //        const tempFilePaths = res.tempFilePaths
			//   //        this.uploadImage(tempFilePaths[0])
			//   //      }
			//   //    })
			// },
			// uploadImage(filePath) {
			// 	console.log('222',filePath)


			// uni.uploadFile({
			// 	url: 'http://43.136.172.73/api/v1//user/upgrade_avatar',
			// 	method: 'PUT',
			// 	  data: {
			// 	      files: filePath // 将 filePath 设置为请求参数的值
			// 	    }, // 直接使用requestData作为请求参数
			// 	header: {
			// 							// "Content-Type": "application/x-www-form-urlencoded",
			// 							'Authorization': 'sfsdf',
			// 	},
			// 	success: (res) => {
			// 		    // 请求成功的回调函数
			// 			// var obj = JSON.parse(uploadFileRes.data);
			// 			 //console.log(obj)
			// 			uni.showToast({
			// 				title:'上传成功',
			// 				icon:'none',
			// 			})
			// 			console.log('00000' ,res);
			// 			this.avatarUrl = res.data.data;

			// 			//console.log('打印用户' );
			// 		  },
			// 		  fail: (err) => {
			// 		    // 请求失败的回调函数
			// 		    console.log(err);
			// 		  }
			// 		});
			// 		},
			// uni.uploadFile({
			//   url: 'http://43.136.172.73/api/v1/account/upload/files', // 图片上传接口地址
			// method: 'POST',
			// data: filePath,
			//    // 要上传的图片文件路径
			//  name: 'data', // 上传图片文件对应的字段名
			//   header: {
			//     'Content-Type': 'multipart/form-data', // 设置Content-Type为multipart/form-data
			//     'Authorization': 'sfsdf' // 根据实际情况设置请求头Authorization
			//   },
			//   success: (res) => {
			//     if (res.statusCode === 200) {
			//       const data = JSON.parse(res.data)
			//       // 处理上传成功后的逻辑
			//       // 例如，更新用户头像信息、展示上传成功提示等
			// 	  uni.showToast({
			// 	    title:'上传成功',
			// 	    icon:'none',
			//       })
			//       console.log('00000' ,res);
			//       this.avatarUrl = data.url;
			//       console.log('打印用户', this.avatarUrl);
			//     } else {
			//       // 处理上传失败的逻辑
			//       uni.showToast({
			//         title: '上传失败',
			//         icon: 'none'
			//       })
			//     }
			//   },
			//   fail: () => {
			//     // 处理上传失败的逻辑
			//     uni.showToast({
			//       title: '上传失败',
			//       icon: 'none'
			//     })
			//   }
			// })



			save() {
				// 保存用户信息逻辑
			},
			outLogin() {
				uni.showToast({
					title: "退出成功",
					icon: "none"
				})
				this.loginOut(); //调用user.js的函数loginout
				uni.reLaunch({
					url: "../index/index"
				})

			},
			onbut(){
				const a={name:this.user.name,userTX:false};
				uni.redirectTo({
				  url: '/pages/my/my?data=' + JSON.stringify(a)
				})
			}
		}
	}
</script>

<style scoped>
	//顶部标题
	.content-title {
		background-color: #fff;
		color: #000;
		font-weight: bold;
		height: 100rpx;
		position: relative;
		font-size: 16px;

		.title-left {
			position: absolute;
			left: 30rpx;
			top: 50%;
			transform: translate(-50%, -50%);
		}

		.title-right {
			text-align: center;
			line-height: 100rpx;
		}
	}

	//顶部栏
	.my {
		background-color: aliceblue;
		margin-bottom: 50rpx;
	}

	.my-header {

		position: relative;
		z-index: 0; // 支付宝小程序下背景不生效时，可以加上这个
		height: 320rpx;
	}

	.header-main {
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-direction: column;
		position: relative;
		top: 100rpx;


	}

	.header-config {
		position: absolute;


	}

	.header-logo {

		display: flex;
		position: absolute;

		width: 60%;
		display: flex;

		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.logo-img {
		width: 120rpx;
		height: 120rpx;
		border-radius: 50%;
		border: 2rpx solid #CCCCCC;
		background-color: #FFFFFF;
	}

	.logo-name {
		width: 300rpx;

		color: black;
		font-size: 30rpx;
		display: flex;
		justify-content: center;
		align-items: center;

	}


	.show-pwd {
		position: absolute;
		right: 50rpx;
		color: darkgray;
		padding-top: 10rpx;
		padding-bottom: 10rpx;
		cursor: pointer;

	}

	.show-pwd1 {
		position: absolute;
		right: 420rpx;
		color: darkgray;
		padding-top: 10rpx;
		padding-bottom: 10rpx;
		cursor: pointer;

	}



	//权益模块
	.myself {

		margin: 30rpx;
		margin-top: 60rpx;
		/*box-shadow:0 0 1px 1px rgba(0, 0, 0, 0.2);*/
	}

	.myself-title {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20rpx;
		background-color: aliceblue;
		;
		font-weight: bold;
		;
	}

	.myself-list {
		padding: 20rpx;
		display: flex;
		flex-wrap: wrap;

		background-color: azure;
	}

	.myself-item {
		width: 33%;
		padding: 10rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

	}

	.myself-img {
		width: 56rpx;
		height: 56rpx;
	}



	.my-config {
		padding: 30rpx;
	}

	.config-item {
		padding: 100rpx;
		display: flex;
		justify-content: space-between;
		padding: 20rpx 0 20rpx 20rpx;
		border-bottom: 2rpx solid #CCCCCC;
		margin: 25rpx;
	}

	.text {
		font-size: 32rpx;
	}

	.config-mark {
		padding-right: 10rpx;

	}

	.my-exit {

		margin-top: 100rpx;
		height: 100rpx;
		line-height: 100rpx;
		text-align: center;
		color: #FFFF;
		background-color: #49BDFB;
		border-radius: 40rpx;

	}
	.onbut{
		width: 200rpx;
		height: 80rpx;
	}
	.btn1{
		font-size: 40rpx;
		line-height: 80rpx;
		align-items: center;
		color: #fff;
		width: 100%;
		height: 100%;
		background-color: #76D7C4;
		position: relative;
		left: 250rpx;
		top: 80rpx;
	}
</style>